<template>
  <view style=" margin-bottom: 8px ">
    <view style="display: flex;justify-content: space-between;align-items: center">
      <view v-if="data.auditStatus == 'SUCCESS'">
        <nut-tag color="#2ECC71" text-color="#2ECC71" plain>审核成功</nut-tag>
      </view>
      <view v-if="data.auditStatus == 'REJECT'">
        <nut-space align="end">
          <nut-tag color="#E74C3C" text-color="#E74C3C" plain>已驳回</nut-tag>
          <IconFont name="ask"  size="15" color="#E74C3C" @click="emit('rejectReason',data)"/>
        </nut-space>

      </view>
      <view v-if="data.auditStatus == 'AUDIT'">
        <nut-tag color="#3498DB" text-color="#3498DB" plain>审核中</nut-tag>
      </view>
      <view style="display: flex;justify-content: flex-end;">
        <nut-space>
          <nut-tag v-if="data.auditStatus == 'REJECT'" color="#2ECC71" text-color="#fff" @click="emit('audit',data)">
            提交审核
          </nut-tag>
          <IconFont color="#1677ff" name="edit" size="15" @click="emit('edit',data)"></IconFont>
          <IconFont color="red" name="del" size="15" @click="emit('sureDelete',data)"></IconFont>
        </nut-space>
      </view>
    </view>
    <nut-card
        @click="emit('detail',data)"
        :img-url="data.productImg"
        :title="data.name"
        :price="data.price"
        :vip-price="data.vipPrice"
        :shop-desc="data.detailDesc"
        :delivery="data.delivery"
        :shop-name="data.enterpriseName"
        style="background: white"
    >
      <template #shop-tag>
        <view class="commodity-spec-box">
          规格：{{ data.specs }}
        </view>
      </template>
      <template #origin>
        &nbsp;
      </template>
    </nut-card>


  </view>


</template>
<script setup>


import {defineEmits, ref} from "vue";
import {IconFont} from "@nutui/icons-vue";
import Taro from "@tarojs/taro";

const props = defineProps({
  data: {
    type: Object,
    default: {}
  }
});
const emit = defineEmits(['sureDelete', 'edit', 'detail', 'audit','rejectReason']);

</script>


<style>


.commodity-spec-box {
  width: 400px;
  font-size: 22px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

</style>